const bgList = ['#89B8E2', '#96D2A7', '#4C908D', '#C8A761', '#FFA988']
import { Empty } from 'antd'
import './companyList.css'

const DetailCompanyList = ({ companyData = [] }) => {
  const handleDetail = (row) => {
    window.open(`/companyDetail?companyCode=${row.companyCode}`, '_blank')
  }

  return (
    <div className="detailCompanyList">
      {companyData.length ? (
        companyData.map((item, index) => (
          <div
            key={index}
            className="detailCompanyItem"
            onClick={() => handleDetail(item)} // handleDetail 函数需在父组件或本组件中定义并提供
          >
            <div className="detailCompanyLeft">
              {item.iconurl ? (
                <img src={item.iconurl} alt="" />
              ) : (
                <div
                  className="logo"
                  style={{ background: bgList[index % 5] }} // bgList 需要在父组件或本组件中定义并提供
                >
                  {item.companyName?.slice(0, 4)}
                </div>
              )}
            </div>
            <div className="detailCompanyRight">
              <div className="companyTitle">
                <div className="companyName">{item.companyName}</div>
                <div
                  className="companyStatus"
                  style={
                    item?.firstTag[0] === '注销'
                      ? { background: '#F5F5F5', color: '#666666' }
                      : { background: 'rgba(7, 193, 96, 0.15)', color: '#07c160' }
                  }>
                  {item?.firstTag[0]}
                </div>
              </div>
              <div className="companyTags">
                {item.secondTag.map((item2, index2) => (
                  <div key={index2} className="companyTagItem">
                    {item2}
                  </div>
                ))}
              </div>
            </div>
          </div>
        ))
      ) : (
        <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
      )}
    </div>
  )
}

export default DetailCompanyList
